<template>
  <div >
    <el-select v-model="id" class="full-width" clearable @change="changeSelect" :disabled="disabled" placeholder="请选择所属项目">
      <el-option
        v-for="item in dataList"
        :key="item.id"
        :label="item.projectName"
        :value="item.id">
      </el-option>
    </el-select>
  </div>
</template>
<script>
  import api from '../../utils/api'
  import util from '../../utils/util'
  export default {
    name: 'rf-project-selection',
    props: {
      pid: {
        type: [Number, String]
      },
      pname: {
        type: String
      },
      pcode: {
        type: String
      },
      disabled: {
        type: Boolean,
        default: false
      }
    },
    data () {
      return {
        id: this.pid,
        name: this.pname,
        dataList: [] // 数据列表
      }
    },
    watch: {
      pid (newValue) {
        this.id = newValue
      }
    },
    mounted () {
      this.getDataList()
    },
    methods: {
      changeSelect (value) {
        let item = util.getObjInArr(this.dataList, 'id', value)
        this.name = item.projectName
        this.$emit('update:pid', this.id)
        this.$emit('update:pname', item.projectName)
        this.$emit('update:pcode', item.projectCode)
        this.$emit('change', this.id)
      },
      // 获取
      getDataList () {
        let fun = api.projects
        let searchForm = {
          keyword: '',
          stat: true,
          page: 1,
          limit: 100
        }
        fun(searchForm).then(res => {
          if (res.code === api.SUCCESS) {
            this.dataList = res.data.list
          }
        })
      }
    }
  }
</script>

